<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />

<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="js/script.js"></script>

<!-- page -->
<div data-role="page" id="loggin">
	<div data-role="header" data-position="fixed">
        <a href="#" data-role="button" data-rel="back">Back</a>
		<h1>Mobile Page</h1>
        <a href="#info" data-role="button" data-icon="info" data-iconpos="notext"></a>
	</div><!-- /header -->
	<div data-role="content">
		login
	</div><!-- /content -->

	<div data-role="footer" data-position="fixed">
		<div data-role="navbar">
			<ul>
				<li><a href="#pg1">One</a></li>
				<li><a href="#pg2">Two</a></li>
			</ul>
		</div><!-- /navbar -->
	</div><!-- /footer -->
</div>
<!-- /page -->

<!-- page -->
<div data-role="page" id="info">
	<div data-role="header" data-position="fixed">
        <a href="#" data-role="button" data-rel="back">Back</a>
		<h1>Mobile Page</h1>
        <a href="info" data-role="button" data-icon="info" data-iconpos="notext"></a>
	</div><!-- /header -->
	<div data-role="content">
		info
	</div><!-- /content -->

	<div data-role="footer" data-position="fixed">
		<div data-role="navbar">
			<ul>
				<li><a href="#pg1">One</a></li>
				<li><a href="#pg2">Two</a></li>
			</ul>
		</div><!-- /navbar -->
	</div><!-- /footer -->
</div>
<!-- /page -->

<!-- page -->
<div data-role="page" id="pg1">
	<div data-role="header" data-position="fixed">
        <a href="#" data-role="button" data-rel="back">Back</a>
		<h1>Mobile Page</h1>
	</div><!-- /header -->
	<div data-role="content">
		<ul data-role="listview">
			<li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li>
            <li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li><li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li><li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li><li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li><li data-role="list-divider">
            	<p>Thursday, October 7, 2010</p>
                <span class="ui-li-count">1</span>
            </li>
			<li>
			    <a href="#articol">
				    <h3>Avery Walker</h3>
	                <img width="150" height="150" src="http://www.paginademedia.ro/wp-content/uploads/2010/07/Romania-logo-3.jpg" />
				    <p><strong>Re: Dinner Tonight</strong></p>
				    <p>Sure, let's plan on meeting at Highland Kitchen at 8:00 tonight. Can't wait! </p>
				    <p class="ui-li-aside"><strong>4:48</strong>PM</p>
			    </a>
            </li>
		</ul>
	</div><!-- /content -->

	<div data-role="footer" data-position="fixed">
		<div data-role="navbar">
			<ul>
				<li><a href="#pg1">One</a></li>
				<li><a href="#pg2">Two</a></li>
			</ul>
		</div><!-- /navbar -->
	</div><!-- /footer -->
</div>
<!-- /page -->


<!-- page -->
<div data-role="page" id="pg2">
	<div data-role="header" data-position="fixed">
        <a href="#" data-role="button" data-rel="back">Back</a>
		<h1>Mobile Page</h1>
	</div><!-- /header -->
	<div data-role="content">
		page 2
	</div><!-- /content -->

	<div data-role="footer" data-position="fixed">
		<div data-role="navbar">
			<ul>
				<li><a href="#pg1">One</a></li>
				<li><a href="#pg2">Two</a></li>
			</ul>
		</div><!-- /navbar -->
	</div><!-- /footer -->
</div>
<!-- /page -->


<!-- page -->
<div data-role="page" id="articol">
	<div data-role="header" data-position="fixed">
        <a href="#" data-role="button" data-rel="back">Back</a>
		<h1>Mobile Page</h1>
	</div><!-- /header -->
	<div data-role="content">
		articol
	</div><!-- /content -->

	<div data-role="footer" data-position="fixed">
		<div data-role="navbar">
			<ul>
				<li><a href="#pg1">One</a></li>
				<li><a href="#pg2">Two</a></li>
			</ul>
		</div><!-- /navbar -->
	</div><!-- /footer -->
</div>
<!-- /page -->
